<template>
    <div class="wrapper">
        <div class="actions" style="margin-bottom: 10px">
            <div class="left">
                <el-button type="primary" plain size="mini" @click="handleClickAdd">新增</el-button>
                <el-button type="primary" plain size="mini" @click="handleClickDel">删除</el-button>
            </div>
            <div class="right">
                <el-pagination small :current-page="paginations.pageIndex" :page-sizes="paginations.pageSizes"
                    :page-size="paginations.pageSize" :layout="paginations.layout" :total="paginations.total"
                    @size-change="handleSizeChange" @current-change="handleCurrentChange" />
            </div>
        </div>
        <el-table ref="multipleTable" :data="tableData" border stripe align="center"
            @selection-change="handleSelectionChange"></el-table>
            <templateConfig :dialogVisble="dialogVisble"></templateConfig>
    </div>
</template>

<script>
import templateConfig from './components/templateConfig.vue';
export default {
    name: 'refundReviewList',
    components: {templateConfig },
    props: [],
    data() {
        return {
            tableData: [],
            paginations: {
                pageIndex: 1, // 当前位于哪页
                pageSize: 20, // 1页显示多少条
                pageSizes: [10, 20, 50, 100], //每页显示多少条
                total: 200,
                layout: "total, sizes, prev, pager, next, jumper", // 翻页属性
            },
            checkedList: [],
            searchParams: {},
            dialogVisble:true
        };
    },
    mounted() { },
    methods: {
        handleSelectionChange(checked) {
            this.checkedList = checked.map((item) => item.id);
        },
        // 通过、驳回
        handleClickOperation(type) {
            this.reviewType = type;
            this.dialogVisible = true;
        },
        handleCloseDialog() {
            this.dialogVisible = false;
        },
        // 每页条数改变
        handleSizeChange(val) {
            this.paginations.pageSize = val;
            this.getDataList();
        },
        // 当前页改变
        handleCurrentChange(val) {
            this.paginations.pageIndex = val;
            this.getDataList();
        },
        getDataList() {
            QueryThermometer({
                page: this.paginations.pageIndex,
                page_size: this.paginations.pageSize,
                ...this.searchParams,
            }).then((res) => {
                this.tableData = res.data.list || [];
                this.paginations.total = res.data.pagination.total;
            });
        },
    },
};
</script>
<style lang="scss" scoped>
.wrapper {
    // padding: 10px;
    padding-top: 5px;
    padding-left: 5px;
    background-color: #fff;

    .orderHeader {
        margin-top: 5px;
        background-color: #fff;

        .orderSearch {
            form {
                ::v-deep .el-form-item__label {
                    font-size: 14px;
                }

                .el-textarea {
                    width: 135px;
                }
            }
        }
    }
    .actions {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        width: 100%;
        background-color: #fff;

        .el-button+.el-dropdown,
        .el-dropdown+.el-button {
            margin-left: 10px;
        }
    }
}
</style>